
<template>
  <view class="nav-bar">
    <view class="score-box">
      <text class="label">总积分</text>
      <text class="value">{{ validScore }}</text>
	  <!-- <text class="value">{{ allsocre }}</text> -->
    </view>
 <!--   <view class="score-box">
      <text class="label">审核中个数</text>
      <text class="value">{{ pendingCount }}</text>
    </view> -->
	<view class="score-box">
	     <text class="label">可用积分</text>
	     <text class="value">{{ score }}</text>
	   </view>
  </view>
<view class="rank-notice" @click="navigateToRank">
      <view class="rank-left">
        <uni-icons type="medal" size="40" color="#ffd700"></uni-icons>
        <text class="notice-text">查看积分排行榜</text>
      </view>
      <uni-icons type="forward" size="32" color="#999"></uni-icons>
    </view>
  <scroll-view scroll-y class="list-container">
    <view v-for="item in records" :key="item.id" class="record-item" @click="viewDetail(item.id)">
      <view class="left">
        <text class="type">{{ typeMap[item.type] }}</text>
        <text class="time">{{ item.createTime }}</text>
        <text class="description" v-if="item.description">{{ item.description }}</text>
      </view>
      <view class="right">
        <text :class="['score', item.score > 0 ? 'add' : 'sub']">
          <view v-if="item.status === '1'">+{{ item.score }}</view>
		  <view v-else style="color: darkorange;">{{ item.score }}</view>
        </text>
        <text :class="['status', statusClass[item.status]]">
          {{ statusMap[item.status] }}
        </text>
        <!-- 显示驳回原因 -->
        <text v-if="item.status === '2' && item.rejectReason" class="reject-reason">
          {{ item.rejectReason }}
        </text>
      </view>
    </view>

    <view v-if="records.length === 0" class="empty">
      <image src="/static/empty.png" class="empty-img" />
      <!-- <text>暂无审核记录</text> -->
    </view>
    
    <view class="float-btn" @click="handleAdd">
      <uni-icons type="plus" size="30" color="#fff"></uni-icons>
    </view>
  </scroll-view>
</template>
<script>
// #ifdef MP-WEIXIN
export default {
  onShareAppMessage() {
    return {
      title: "高潜人才",
      path: `/pages/integration/integration`
    }
  },
  onShareTimeline() {
      return {
        title: '专业人才测评，发现你的潜力！',
        query: 'from=timeline',          // 可选参数
        imageUrl: '/static/wx.png' // 朋友圈专用图片
      }
    }
}
// #endif
</script>
<script setup>
import { ref, onMounted, computed } from 'vue'
import { http } from '../../utils/requestUtil';
const allsocre = ref(0)
// 审核记录数据
const records = ref([])
const score = ref(0)
// 状态映射（适配字符串类型状态值）
const statusMap = {
  '0': '审核中',
  '1': '已通过',
  '2': '已驳回'
}

const statusClass = {
  '0': 'pending',
  '1': 'approved',
  '2': 'rejected'
}

// 类型映射（根据实际接口返回类型值）
const typeMap = {
  training: '培训积分',
  // 根据实际接口可能返回的类型补充映射
  project: '项目积分',
  activity: '活动积分'
}

// 计算有效积分（状态为1的积分总和）
const validScore = computed(() => {
  return records.value
    .filter(item => item.status === '1')
    .reduce((sum, item) => sum + Number(item.score), 0)
})

// 计算审核中数量（状态为0的记录数）
const pendingCount = computed(() => {
  return records.value.filter(item => item.status === '0').length
})

const viewDetail = (id) => {
  uni.navigateTo({
    url: `/pages/integration/integrationDetail/integrationDetail?id=${id}`
  })
}

const handleAdd = () => {
  uni.navigateTo({
    url: `/pages/integration/addIntegration/addIntegration`
  })
}
const navigateToRank = ()=>{
	uni.navigateTo({
		url:"/pages/integration/integarlRank/integarlRank"
	})
}
const loadData = async () => {
		console.log()
  try {
    const userId = uni.getStorageSync('userInfo').userId
	
    const res = await http.get('/bole/application/list?pageSize=1000&userId=' + userId)
    records.value = res.rows.map(item => ({
      ...item,
      // 转换文件字符串为数组
      files: item.files ? item.files.split(',') : [],
      // 转换时间格式（示例：保留原始时间）
      createTime: item.createTime.slice(0, 16) // 截取年月日时分
    }))
	
	score.value=res.additionalInteger
	// 更新本地存储 获取 userInfo 数据
	let userInfo = uni.getStorageSync('userInfo');
	    
	userInfo.score = score.value;
	
	uni.setStorageSync('userInfo', userInfo);

	allsocre.value=uni.getStorageSync('userInfo').allscore
	
  } catch (error) {
    console.error('数据加载失败:', error)
    uni.showToast({ title: '数据加载失败', icon: 'none' })
  }
}

onMounted(() => {
	// score.value=uni.getStorageSync('userInfo').score
  loadData()
  uni.$on('refreshData',  loadData);
})
</script>
<style>
	/* 头部导航栏（参考网页1、2、3） */
	.status_bar {
	  height: var(--status-bar-height);
	  width: 100%;
	}
	
	.nav-bar {
	  display: flex;
	  justify-content: space-around;
	  padding-top: 20rpx;
	  padding-bottom: 20rpx;
	  background: #fff;
	  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
	}
	
	.nav-bar .score-box {
	  text-align: center;
	}
	
	.nav-bar .score-box .label {
	  display: block;
	  color: #666;
	  font-size: 28rpx;
	}
	
	.nav-bar .score-box .value {
	  font-size: 40rpx;
	  font-weight: bold;
	  color: #409eff;
	}
	
	.rank-notice {
	  /* 采用 flex 布局，让子元素水平排列，并且两端对齐 */
	  display: flex;
	  justify-content: space-between;
	  /* 让子元素在交叉轴上垂直居中对齐 */
	  align-items: center;
	  /* 内边距，上下 25rpx，左右 30rpx */
	  padding: 25rpx 30rpx;
	  /* 外边距，上下 20rpx，左右 30rpx */
	  margin: 20rpx 30rpx;
	  /* 背景颜色为白色 */
	  background: #fff;
	  /* 圆角半径为 16rpx */
	  border-radius: 16rpx;
	  /* 添加阴影效果，水平偏移 0，垂直偏移 4rpx，模糊半径 12rpx，颜色为 rgba(0,0,0,0.08) */
	  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
	}
	
	.rank-notice .rank-left {
	  /* 采用 flex 布局，让子元素水平排列 */
	  display: flex;
	  /* 让子元素在交叉轴上垂直居中对齐 */
	  align-items: center;
	}
	
	.rank-notice .rank-left .notice-text {
	  /* 左侧外边距为 20rpx */
	  margin-left: 20rpx;
	  /* 字体大小为 28rpx */
	  font-size: 28rpx;
	  /* 字体颜色为 #333 */
	  color: #333;
	}
	
	/* 审核列表（参考网页4、5、6） */
	.list-container {
	  height: calc(100vh - 180rpx);
	  padding-top: 20rpx;
	}
	
	.list-container .record-item {
	  display: flex;
	  justify-content: space-between;
	  padding: 30rpx;
	  margin-bottom: 20rpx;
	  background: #fff;
	  border-radius: 16rpx;
	  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
	}
	
	.list-container .record-item .left {
	  flex: 2;
	}
	
	.list-container .record-item .left .type {
	  display: block;
	  font-size: 32rpx;
	  color: #333;
	}
	
	.list-container .record-item .left .time {
	  font-size: 24rpx;
	  color: #999;
	}
	
	.list-container .record-item .right {
	  flex: 1;
	  text-align: right;
	  display: flex;
	  flex-direction: column;
	  justify-content: space-between;
	}
	
	.list-container .record-item .right .score {
	  font-size: 36rpx;
	}
	
	.list-container .record-item .right .score.add {
	  color: #67c23a;
	}
	
	.list-container .record-item .right .score.sub {
	  color: #f56c6c;
	}
	
	.list-container .record-item .right .status {
	  display: block;
	  font-size: 24rpx;
	}
	
	.list-container .record-item .right .status.pending {
	  color: #e6a23c;
	}
	
	.list-container .record-item .right .status.approved {
	  color: #67c23a;
	}
	
	.list-container .record-item .right .status.rejected {
	  color: #f56c6c;
	}
	
	.list-container .empty {
	  text-align: center;
	  padding: 100rpx 0;
	}
	
	.list-container .empty .empty-img {
	  width: 200rpx;
	  height: 200rpx;
	  margin-bottom: 20rpx;
	}
	
	.float-btn {
	  position: fixed;
	  right: 30rpx;
	  bottom: 120rpx;
	  width: 100rpx;
	  height: 100rpx;
	  border-radius: 50%;
	  background: linear-gradient(135deg, #409EFF, #2979FF);
	  box-shadow: 0 8rpx 24rpx rgba(64, 158, 255, 0.3);
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  z-index: 999;
	}
	
	/* 暗黑模式适配（参考网页3样式优化） */
	@media (prefers-color-scheme: dark) {
	 .float-btn {
	    background: linear-gradient(135deg, #2c3e50, #34495e);
	  }
	}
	
	/* 在原有样式基础上补充以下样式 */
	.description {
	  display: block;
	  font-size: 24rpx;
	  color: #999;
	  margin-top: 10rpx;
	  max-width: 400rpx;
	  /* 这里的 text-ellipsis(2) 是 SCSS 混入，CSS 没有直接对应，所以未处理 */
	}
	
	.reject-reason {
	  display: block;
	  font-size: 24rpx;
	  color: #f56c6c;
	  margin-top: 10rpx;
	}
	
	/* 调整右侧布局 */
	.right {
	  display: flex;
	  flex-direction: column;
	  justify-content: space-between;
	}
</style>